﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>云科技</title>
    <link type="text/css" rel="stylesheet" media="all" href="../styles/global.css"/>
    <link type="text/css" rel="stylesheet" media="all" href="../styles/global_color.css"/>
    <script language="javascript" type="text/javascript">
        //保存成功的提示信息
        function showResult() {
            showResultDiv(true);
            window.setTimeout("showResultDiv(false);", 3000);
        }

        function showResultDiv(flag) {
            var divResult = document.getElementById("save_result_info");
            if (flag)
                divResult.style.display = "block";
            else
                divResult.style.display = "none";
        }

        //显示选填的信息项
        function showOptionalInfo(imgObj) {
            var div = document.getElementById("optionalInfo");
            if (div.className == "hide") {
                div.className = "show";
                imgObj.src = "../images/hide.png";
            }
            else {
                div.className = "hide";
                imgObj.src = "../images/show.png";
            }
        }
    </script>
    <script src="../js/jquery-2.2.4.min.js"></script>
    <script src="../js/module.js"></script>
</head>
<body>
<!--Logo区域开始-->
<div id="header">
    <img src="../images/logo.png" alt="logo" class="left"/>
    <a href="#">[退出]</a>
</div>
<!--Logo区域结束-->
<!--导航区域开始-->
<div id="navi">
    <ul id="menu">
        <li><a href="../index.html" class="index_off"></a></li>

        <li><a href="../user/user_info.html" class="information_off"></a></li>
        <li><a href="../user/user_modi_pwd.html" class="password_off"></a></li>
    </ul>
</div>
<!--导航区域结束-->
<!--主要区域开始-->
<div id="main">
    <!--保存成功或者失败的提示消息-->
    <div id="save_result_info" class="save_fail">保存失败，该身份证已经开通过账务账号！</div>
    <!--必填项-->
    <form action="" method="" class="main_form">
        <div class="text_info clearfix"><span>姓名：</span></div>
        <div class="input_info">
            <input id="accountName" type="text" value="张三"/>
            <span class="required">*</span>
            <div class="validate_msg_long">20长度以内的汉字、字母和数字的组合</div>
        </div>
        <div class="text_info clearfix"><span>身份证：</span></div>
        <div class="input_info">
            <input id="accountIdCard" type="text" 开通/>
            <span class="required">*</span>
            <div class="validate_msg_long">正确的身份证号码格式</div>
        </div>
        <div class="text_info clearfix"><span>登录账号：</span></div>
        <div class="input_info">
            <input id="accountNum" type="text" value="创建即启用，状态为开通"/>
            <span class="required">*</span>
            <div class="validate_msg_long">30长度以内的字母、数字和下划线的组合</div>
        </div>
        <div class="text_info clearfix"><span>密码：</span></div>
        <div class="input_info">
            <input id="accountPassword" type="password"/>
            <span class="required">*</span>
            <div class="validate_msg_long">30长度以内的字母、数字和下划线的组合</div>
        </div>
        <div class="text_info clearfix"><span>重复密码：</span></div>
        <div class="input_info">
            <input id="repeat" type="password"/>
            <span class="required">*</span>
            <div class="validate_msg_long">两次密码必须相同</div>
        </div>
        <div class="text_info clearfix"><span>电话：</span></div>
        <div class="input_info">
            <input id="telephone" type="text" class="width200"/>
            <span class="required">*</span>
            <div class="validate_msg_medium">正确的电话号码格式：手机或固话</div>
        </div>
        <!--可选项-->
        <div class="text_info clearfix"><span>可选项：</span></div>
        <div class="input_info">
            <img src="../images/show.png" alt="展开" onclick="showOptionalInfo(this);"/>
        </div>
        <div id="optionalInfo" class="hide">
            <div class="text_info clearfix"><span>推荐人身份证号码：</span></div>
            <div class="input_info">
                <input id="tIdCard" type="text"/>
                <div class="validate_msg_long">正确的身份证号码格式</div>
            </div>
            <div class="text_info clearfix"><span>生日：</span></div>
            <div class="input_info">
                <input type="text" value="由身份证号计算而来" readonly class="readonly"/>
            </div>
            <div class="text_info clearfix"><span>Email：</span></div>
            <div class="input_info">
                <input id="accountEmail" type="text" class="width350"/>
                <div class="validate_msg_tiny">50长度以内，合法的 Email 格式</div>
            </div>
            <div class="text_info clearfix"><span>职业：</span></div>
            <div class="input_info">
                <select id="select">
                    <option>干部</option>
                    <option>学生</option>
                    <option>技术人员</option>
                    <option>其他</option>
                </select>
            </div>
            <div class="text_info clearfix"><span>性别：</span></div>
            <div class="input_info fee_type">
                <input type="radio" name="radSex" checked="checked" id="female" value="女"/>
                <label for="female">女</label>
                <input type="radio" name="radSex" id="male" value="男"/>
                <label for="male">男</label>
            </div>
            <div class="text_info clearfix"><span>通信地址：</span></div>
            <div class="input_info">
                <input id="address" type="text" class="width350"/>
                <div class="validate_msg_tiny">50长度以内</div>
            </div>
            <div class="text_info clearfix"><span>邮编：</span></div>
            <div class="input_info">
                <input id="postCode" type="text"/>
                <div class="validate_msg_long">6位数字</div>
            </div>
            <div class="text_info clearfix"><span>QQ：</span></div>
            <div class="input_info">
                <input id="qqNum" type="text"/>
                <div class="validate_msg_long">5到13位数字</div>
            </div>
        </div>
        <!--操作按钮-->
        <div class="button_info clearfix">
            <input id="save" type="button" value="保存" class="btn_save"  onclick="location.href='account_list.html'"/>
            <input type="button" value="取消" class="btn_save" onclick="location.href='account_add.html'"/>
        </div>
    </form>

    <script>

        <!--添加按钮点击事件-->
        $(function () {
            $("#save").click(function (e) {
                e.preventDefault();
                // 真实姓名
                var accountName = $("#accountName").val();
                // 身份证号
                var accountIdCard = $("#accountIdCard").val();
                // 登录账号
                var accountNum = $("#accountNum").val();
                // 密码
                var accountPassword = $("#accountPassword").val();
                // 重复密码
                var repeat = $("#repeat").val();
                // 电话
                var telephone = $("#telephone").val();
                // 推荐人身份证号
                var tIdCard = $("#tIdCard").val();
                // 邮箱
                var accountEmail = $("#accountEmail").val();
                // 职业
                var occupation = $("#select option:selected").text();
                // 性别
                var gender = $('input:radio:checked').val();
                // 通讯地址
                var address = $("#address").val();
                // 邮编
                var postCode = $("#postCode").val();
                // QQ号
                var qq = $("#qqNum").val();

                var url = "/kobe/account/addOne";
                var data = {
                    "realName": accountName,
                    "idcardNo": accountIdCard,
                    "loginName": accountNum,
                    "loginPasswd": accountPassword,
                    "telephone": telephone,
                    "email": accountEmail,
                    "occupation": occupation,
                    "gender": gender,
                    "mailaddress": address,
                    "zipcode": postCode,
                    "qq": qq
                };
                console.log(qq);
                $.post(url, data, function (resp) {
                    console.log(resp);
                })

            });
        });
    </script>

</div>
<!--主要区域结束-->
<div id="footer">
    <span>[源自北美的技术，最优秀的师资，最真实的企业环境，最适用的实战项目]</span>
    <br/>
    <span>版权所有(C)云科技有限公司 </span>
</div>
</body>
</html>
